<template>
  <el-dialog
    v-el-drag-dialog
    :title="'调度排班'"
    :visible.sync="visible"
    width="700px"
  >
    <div class="content">
      <div class="row-item">
        <div class="row-label">所属站点:</div>
        <div class="row-value">{{ form.orgName }}</div>
      </div>
      <div class="row-item">
        <div class="row-label">绑定司机:</div>
        <div class="row-value">{{ form.userName }}</div>
      </div>
      <div class="row-item">
        <div class="row-label">排班时间:</div>
        <div class="row-value">{{ form.day }}</div>
      </div>
      <div class="row-item">
        <div class="row-label">绑定司机类型:</div>
        <div class="row-value">{{ form.userTypeDesc }}</div>
      </div>
      <div v-if="form.cartFlag === 2" class="row-item">
        <div class="row-label">配送员:</div>
        <div class="row-value">
          <el-select v-model="form.dutyDriverUserId" placeholder="请选择" style="width: 160px;">
            <el-option
              v-for="item in deliveryman"
              :key="item.userId"
              :label="item.userName"
              :value="item.userId"
            />
          </el-select>
        </div>
      </div>
      <div v-else class="row-item">
        <div class="row-label">司机:</div>
        <div class="row-value">
          <el-select v-model="form.dutyDriverUserId" placeholder="请选择" style="width: 160px;">
            <el-option
              v-for="item in driverOption"
              :key="item.userId"
              :label="item.userName"
              :value="item.userId"
            />
          </el-select>
        </div>
      </div>
      <div v-if="form.cartFlag === 1" class="row-item">
        <div class="row-label">押运员:</div>
        <div class="row-value">
          <el-select v-model="form.dutyEscortUserId" placeholder="请选择" style="width: 160px;">
            <el-option
              v-for="item in escortOption"
              :key="item.userId"
              :label="item.userName"
              :value="item.userId"
            />
          </el-select>
        </div>
      </div>
    </div>
    <div v-if="form.cartFlag === 1" class="content content2">
      <div class="row-item">
        <el-radio v-model="form.orderReceiver" :label="0">自动派单给大车司机</el-radio>
      </div>
      <div class="row-item">
        <el-radio v-model="form.orderReceiver" :label="1">自动派单给押运员</el-radio>
      </div>
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取 消</el-button>
      <el-button type="primary" @click="save">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
  import { cartSchedulingUpdate, csDeliverUserList } from '@/api'
  export default {
    name: 'vehicleSingle',
    props: {
      parentFetchData: {
        type: Function
      }
    },
    data() {
      return {
        visible: false,
        driverOption: [],
        escortOption: [],
        deliveryman: [],
        form: {
          cartFlag: '',
          orgName: '',
          dutyDriverUserId: '',
          dutyEscortUserId: '',
          day: '',
          orderReceiver: 0,
          userTypeDesc: ''
        }
      }
    },
    created() {
    },
    methods: {
      open(temp) {
        return new Promise(resolve => {
          this.resolve = resolve
          this.visible = true
          this.form = { ...temp.currentRow, day: temp.currentDay, ...temp.currentUser }
          if (!this.form.orderReceiver && this.form.orderReceiver !== 0) {
            this.$set(this.form, 'orderReceiver', 0)
          }
          this.getUserOrder()
        })
      },
      async getUserOrder() {
        const params = {
          deliveryOrgId: this.form.orgId || '',
          accountType: 1,
          utype: 65536 // 押运员
        }
        const params2 = {
          deliveryOrgId: this.form.orgId || '',
          accountType: 1,
          utype: 8388608 // 司机
        }
        const params3 = {
          deliveryOrgId: this.form.orgId || '',
          accountType: 1,
          utype: 32 // 配送员
        }
        const res = await csDeliverUserList(params)
        const res2 = await csDeliverUserList(params2)
        const res3 = await csDeliverUserList(params3)
        this.driverOption = res2.data
        this.escortOption = res.data
        this.deliveryman = res3.data
      },
      save() {
        if (!this.form.dutyDriverUserId) {
          this.$message.warning('请选择司机')
          return
        }
        if (!this.form.dutyEscortUserId && this.form.cartFlag === 1) {
          this.$message.warning('请选择押运员')
          return
        }
        if (!this.form.orderReceiver && this.form.orderReceiver !== 0 && this.form.cartFlag === 1) {
          this.$message.warning('请勾选自动派单')
          return
        }
        if (this.form.cartFlag === 2) {
          this.form.orderReceiver = 0
        }
        const param = {
          userId: this.form.userId,
          orgId: this.form.orgId,
          dutyDriverUserId: this.form.dutyDriverUserId,
          orderReceiver: this.form.orderReceiver,
          schedulingTimeList: [this.form.day]
        }
        if (this.form.cartFlag === 1) {
          param.dutyEscortUserId = this.form.dutyEscortUserId
        }
        cartSchedulingUpdate(param).then(res => {
          if (res.data) {
            this.$message.success('排班成功')
            this.visible = false
            this.parentFetchData({})
          }
        })
      }
    }
  }
</script>

<style lang="scss" scoped>
    .content {
      display: flex;
      width: 100%;
      flex-wrap: wrap;
      .row-item {
        display: flex;
        width: 50%;
        margin-bottom: 20px;
        .row-label {
          width: 100px;
          height: 30px;
          line-height: 30px;
        }
        .row-value {
          width: 210px;
          line-height: 30px;
        }
      }
    }
    .content2 {
      margin-left: 70px;
    }
</style>

